import React, { Suspense } from 'react'
import ReactDOM from 'react-dom/client'
import '@/style/index.scss'
import App from './App'
import reportWebVitals from './reportWebVitals'
import { BrowserRouter as Router }  from "react-router-dom"
import { Provider as StoreProvider} from 'react-redux'
import { ConfigProvider } from 'antd'
import Store from '@/store'
import WebLoading from 'components/WebLoading'
import progress from '@/utils/progress'
import Storage from '@/utils/storage'
import { THEME } from '@/config'

window.progress = progress
window.storage = new Storage({ type: 'sessionStorage' })
window.Lstorage = new Storage({ type: 'localStorage' })

const root = ReactDOM.createRoot(document.getElementById('root'))
root.render(
  <StoreProvider store={Store}>
    <ConfigProvider theme={THEME}>
      <Suspense fallback={<WebLoading />}>
        <Router>
          <App />
        </Router>
      </Suspense>
    </ConfigProvider>
  </StoreProvider>
)

reportWebVitals()
